<template>
  <div class="auth-mini" v-show="!ifAuthMini && !selfSupport">
    <div class="mark"></div>
    <div class="message-box">企业未授权小程序，请联系管理员授权小程序后方可使用。</div>
  </div>
</template>

<script>
import { mapGetters } from 'vuex'
import commonService from 'SERVICE/commonService'
export default {
  data() {
    return {
      ifAuthMini: true,
      selfSupport: 1
    }
  },
  computed: {
    ...mapGetters(['userInfo'])
  },
  methods: {
    getAuthMini() {
      let uuid = localStorage.getItem('uuid') || ''
      let enterpriseId = localStorage.getItem('enterpriseId') || ''
      commonService
        .getAuthMini({
          uuid: uuid,
          enterpriseId: enterpriseId
        })
        .then(res => {
          this.ifAuthMini = res.ifAuthMini
        })
        .catch()
    }
  },
  mounted() {
    // 企业微信不请求相关借口
    let status = sessionStorage.getItem('userLoginType')
    if (this.userInfo && this.userInfo.token && !status) {
      this.selfSupport = this.userInfo.selfSupport || 0
      // 非自营请求是否授权小程序
      if (!this.selfSupport) {
        this.getAuthMini()
      }
    }
  }
}
</script>


<style lang="less" scoped>
.auth-mini {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  .mark {
    position: fixed;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.6);
    left: 0;
    top: 0;
    bottom: 0;
    z-index: 99999;
  }
  .message-box {
    width: 268px;
    background: rgba(255, 255, 255, 1);
    border-radius: 8px;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 999999;
    font-size: 16px;
    color: rgba(64, 81, 112, 1);
    line-height: 24px;
    padding: 20px;
  }
}
</style>